<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head></h:head>
<body>
	<h:form id="formCobros">

		<p:growl id="msgs" showDetail="true" life="1000" />
		<p:panel header="Registrar Cobro" style="border: none;">
			<p:panel id="basic" style="width:800px">


				<h:panelGrid columns="2" cellpadding="6">
					<h:outputLabel value="Interesado: " />
					<p:selectOneMenu id="advanced" converter="paisConverter"
						value="#{provinciaBean.paisSelected}" effect="fade" var="p"
						filter="true" filterMatchMode="startsWith">

						<f:selectItems var="pais" value="#{provinciaBean.listPaises}"
							itemLabel="Seleccione" itemValue="#{pais}" />
						<p:column>
							<h:outputText value="#{p.nombrePais}" />
						</p:column>
					</p:selectOneMenu>
					</h:panelGrid>
						<p:separator id="separator" />
					<h:panelGrid columns="5" cellpadding="5">
					<h:outputLabel value="Concepto: " />
					
							<h:panelGrid columns="2" cellpadding="3">
								<h:outputLabel value="Concepto:" />

								<p:selectOneMenu id="comboConcepto"
									converter="conceptoConverter"
									value="#{cobroBean.conceptoSelected}" effect="fade"
									var="con">

									<f:selectItems var="concepto"
										value="#{cobroBean.listConcepto}"
										itemLabel="#{concepto.nombreConcepto}" itemValue="#{concepto}" />
									<p:column>
										<h:outputText value="#{con.nombreConcepto}" />
									</p:column>
								</p:selectOneMenu>

							</h:panelGrid>

				
				</h:panelGrid>
				<h:panelGrid columns="2" cellpadding="6">
					<h:outputLabel for="nomBebida" value="Importe:" />
					<p:inputText id="nomBebida" required="true" label="Nombre Bebida"
						value="#{bebidaBean.bebida.nombreBebida}" />
					<p:message for="nomBebida" display="icon" />
						</h:panelGrid>
					<h:panelGrid columns="2" cellpadding="6">
					<h:outputLabel for="nomBebida" value="Fecha de pago:" />
					<p:inputText id="descBebida" required="true"
						label="Descripción Bebida"
						value="#{bebidaBean.bebida.descripcionBebida}" />
					<p:message for="descBebida" display="icon" />
				</h:panelGrid>
				<h:panelGrid columns="2" cellpadding="3">
								<h:outputLabel value="Modo de pago: " />

								<p:selectOneMenu id="comboModoPago"
									converter="modoPagoConverter"
									value="#{cobroBean.modoPagoSelected}" effect="fade"
									var="con">

									<f:selectItems var="modoPago"
										value="#{cobroBean.listModoPago}"
										itemLabel="#{modoPago.nombreModoPago}" itemValue="#{modoPago}" />
									<p:column>
										<h:outputText value="#{con.nombreModoPago}" />
									</p:column>
								</p:selectOneMenu>

							</h:panelGrid>
				<p:separator id="separator" />

				<p:commandButton value="Guardar" id="ajax" process="@form"
					icon="ui-icon-disk" update=":#{p:component('formCobros')}"
					actionListener="#{bebidaBean.guardarBebida}" />




			</p:panel>
			<p:dataTable id="singleDT" var="td"
				value="#{bebidaBean.listaBebidas}"
				selection="#{bebidaBean.selectedBebida}" rowKey="#{td.nombreBebida}"
				editable="true" style="width:100%" rows="5" paginator="true"
				paginatorPosition="bottom"
				paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}">

				<p:ajax event="rowEdit" listener="#{bebidaBean.onRowEdit}"
					update=":#{p:component('msgs')}" />
				<p:ajax event="rowEditCancel" listener="#{bebidaBean.onRowCancel}"
					update=":#{p:component('msgs')}" />

				<f:facet name="header">
					<p:outputPanel style="text-align:right">
						<h:outputText value="Buscar: " />
						<p:inputText id="globalFilter"
							onkeyup="PF('bebidaTable').filter()" style="width:150px"
							placeholder="Ingrese concepto" />
					</p:outputPanel>
				</f:facet>

				<p:column headerText="Concepto" style="text-align:left">
					<p:cellEditor>
						<f:facet name="output">
							<h:outputText value="#{td.nombreBebida}" />
						</f:facet>
						<f:facet name="input">
							<p:inputText id="modelInput" value="#{td.nombreBebida}"
								style="width:100%" />
						</f:facet>
					</p:cellEditor>
				</p:column>
				<p:column headerText="Importe" style="text-align:left">
					<p:cellEditor>
						<f:facet name="output">
							<h:outputText value="#{td.descripcionBebida}" />
						</f:facet>
						<f:facet name="input">
							<p:inputText value="#{td.descripcionBebida}" style="width:100%" />
						</f:facet>
					</p:cellEditor>
				</p:column>
				<p:column headerText="Vencimiento" style="text-align:left">
					<p:cellEditor>
						<f:facet name="output">
							<h:outputText value="#{td.contenidoBebida}" />
						</f:facet>
						<f:facet name="input">
							<p:inputText value="#{td.contenidoBebida}" style="width:100%" />
						</f:facet>
					</p:cellEditor>
				</p:column>

				<p:column headerText="Fecha de Pago">


				</p:column>
				<p:column headerText="Modo de Pago">


				</p:column>


				<p:column headerText="Modificar"
					style="width:70px;text-align: center">
					<p:rowEditor />
				</p:column>

				<p:column headerText="Eliminar"
					style="width:32px;text-align: center">
					<p:commandButton process="singleDT"
						update=":#{p:component('singleDT')}" icon="ui-icon-close"
						title="View" action="#{bebidaBean.eliminarBebida}">
						<f:setPropertyActionListener value="#{td}"
							target="#{bebidaBean.selectedBebida}" />

						<p:confirm header="Confirmación" message="Está seguro?"
							icon="ui-icon-alert" />
					</p:commandButton>
				</p:column>

			</p:dataTable>

			<p:confirmDialog global="true" showEffect="fade" hideEffect="fade">
				<p:commandButton value="Si" type="button"
					styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
				<p:commandButton value="No" type="button"
					styleClass="ui-confirmdialog-no" icon="ui-icon-close" />
			</p:confirmDialog>

			<br />



		</p:panel>
	</h:form>

</body>
</html>